<!DOCTYPE html>
<html lang="en">
  <head>
      <meta charset="UTF-8">
      <title>练习1</title>
    <script src="script/jquery-3.6.0.min.js"></script>
    <script type="text/javascript">
      /*
        分别使用Jquery-ajax和Promise代码重排发出3次 ajax请求
        体会promise的方便之处
       */
      //使用jquery发送ajax请求获取数据
      // $(function () {
      //   //第一次请求
      //   $.ajax({
      //     url:"data/person.json",
      //     success(result){
      //       console.log("第一次请求:", result);
      //       //第二次请求
      //       $.ajax({
      //         url:`data/class_${result.class_id}.json`,
      //         success(result) {
      //           console.log("第二次请求:", result);
      //           //第三次请求
      //           $.ajax({
      //             url:`data/school_${result.school_id}.json`,
      //             success(result){
      //               console.log("第三次请求:", result);
      //             }
      //           })
      //         }
      //       })
      //     }
      //   })
      // })

      //使用promise
      // new Promise((resolve, reject) => {
      //   $.ajax({
      //     url:"data/person.json",
      //     success(result) {
      //       console.log("promise第一次请求:", result);
      //       resolve(result);
      //     },
      //     error(err){
      //       reject(err);
      //     }
      //   })
      // }).then((result) => {
      //   return new Promise((resolve, reject) => {
      //     $.ajax({
      //       url:`data/class_${result.class_id}.json`,
      //       success(result) {
      //         console.log("promise第二次请求:", result);
      //         resolve(result);
      //       },
      //       error(err){
      //         reject(err);
      //       }
      //     })
      //   })
      // }).then((result) => {
      //   return new Promise((resolve, reject) => {
      //     $.ajax({
      //       url:`data/school_${result.school_id}.json`,
      //       success(result) {
      //         console.log("promise第三次请求:", result);
      //         resolve(result);
      //       },
      //       error(err){
      //         reject(err);
      //       }
      //     })
      //   })
      // }).catch((err) => {
      //   console.log("请求发生异常=", err);
      // })
      //
      //提取请求体，重排promise
      function get(url, data) {
        return new Promise((resolve, reject) => {
          $.ajax({
            url: url,
            data: data,
            success(result) {
              resolve(result);
            },
            error(err) {
              reject(err);
            }
          })
        })
      }

      get("data/person.json")
              .then((result) => {
                console.log("promise重排第一次请求:", result)
                return get(`data/class_${result.class_id}.json`)
              })
              .then((result) => {
                console.log("promise重排第二次请求:", result)
                return get(`data/school_${result.school_id}.json`)
              })
              .then((result) => {
                console.log("promise重排第三次请求:", result)
              })
              .catch((err) => {
                return console.log("promise重排发送ajax请求出现异常:", err)
              })
    </script>
  </head>
  <body>

  </body>
</html>